<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="referrer" content="no-referrer" />
<title>微信素材列表</title>
<link rel="stylesheet" type="text/css" href="../css/style.css">
<link rel="stylesheet" type="text/css" href="../js/layer/theme/default/layer.css">
<script type="text/javascript" src="../js/vue.js"></script>
<script type="text/javascript" src="../js/filter.js"></script>
<script type="text/javascript" src="../js/config.js"></script>
<link href="../images/favicon.ico" rel="icon" type="image/x-icon" />
<script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="../js/jquery.serializejson.js"></script>
<script type="text/javascript" src="../js/layer/layer.js"></script>
<script type="text/javascript" src="../js/paging.js"></script>
</head>
<body>
	<div class="crm-content" id="materialList">
		<a href="../menu/menu_list.html"  class="add-button">微信菜单管理</a>
		<a href="../material/material_list.html"  class="add-button">微信素材管理</a>
		<a href="../keyword/keyword_list.html"  class="add-button">微信关键字管理</a>
		<table class="list-box">
			<tr>
				<th>标题</th>
				<th>封面图</th>
				<th>作者</th>
				<th>操作</th>
			</tr>
			<tr v-for="(re,index) in item">
				<td><a href="javascript:void(0);" onclick="mediaView(this);" v-bind:data-media_id="re.media_id">{{re.content.news_item[0].title}}</a></td>
				<td><img alt="" v-bind:src="re.content.news_item[0].thumb_url" style="width: 180px; height: 110px;" /></td>
				<td>{{re.content.news_item[0].author}}</td>
				<td><span class="over-small"  onclick="newMaterialWxKeyword(this);" v-bind:data-media_id="re.media_id">新增素材关键字</span></td>
			</tr>
		</table>
		
		<form class="cell-content" id="insertMaterialWxKeywordForm" style="display: none;" >
			<div class="cell">
				<label><span class="red">*</span>关键字名称</label>
				<input type="text" name="keywordName" id="keywordName">
			</div>
			<div class="cell" style="display: none;">
				<label><span class="red">*</span>关键字类型</label>
				<input type="text" name="keywordType" id="keywordType" v-model="keywordType">
			</div>
			<div class="cell">
				<label><span class="red">*</span>回复信息</label>
				<input type="text" name="keywordValue" id="keywordValue" v-model="keywordValue">
			</div>
		</form>
	</div>
	<div id="page" class="page_div"></div>
	<div id="materialView" style="display: none;"></div>
	
	
	<script type="text/javascript">
		var materialList = new Vue({
			el : '#materialList',
			data : {
				res : {},
				item : [],
				keywordValue : '1',
				keywordType : "news",
				hashItem : {}
			}
		})
	</script>
	<script type="text/javascript" src="../js/wxMaterial.js"></script>
	<script type="text/javascript">
		var pageIndexNow = 1;
		function init(pageIndex) {
			$.ajax({
				type : "get", //data 传送数据类型。post 传递
				dataType : 'json', // 返回数据的数据类型json
				url : wxUrl + "/getMaterialList", // yii 控制器/方法
				data : {
					pageIndex : pageIndex,
					pageSize : 20,
					mediaType : "NEWS"
				},
				cache : false,
				error : function() {
					// alert("数据传输错误");
				},
				success : function(data) {
					console.log(data.result);
					materialList.res = data.result;
					materialList.item = JSON.parse(data.result.json).item;
					for (var i = 0; i < materialList.item.length; i++) {
						var media_id = materialList.item[i].media_id;
						materialList.hashItem[media_id] = materialList.item[i]
					}
					var pageTotal = JSON.parse(data.result.json).total_count;
					var pageNumTotal = Math.ceil(pageTotal/20);
					$("#page").paging({
						pageNo:pageIndexNow,
						totalPage: pageNumTotal,
						totalSize: pageTotal,
						callback: function(num) {
							pageIndexNow = num;
							init(num)
						}
					});
				}
			});
		}
		init(1);
		function mediaView(obj) {
			window.location.href = materialList.hashItem[$(obj).attr("data-media_id")].content.news_item[0].url;
		}
	</script>
	

</body>
</html>
